<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
	
	<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
	<!--[if lte IE 6]>
		<style type="text/css" media="screen">
			.tabbed { height:420px; }
		</style>
	<![endif]-->
	
	<script src="js/jquery-1.4.1.min.js" type="text/javascript"></script>
	<script src="js/jquery.jcarousel.pack.js" type="text/javascript"></script>
	<script src="js/jquery.slide.js" type="text/javascript"></script>
	<script src="js/jquery-func.js" type="text/javascript"></script>
	
</head>
<body>
<!-- Top -->
<div id="top">
	
	<div class="shell">
		
		<!-- Header -->
		<div id="header">
			
			<div id="navigation">
				<ul>
				    <li><a href="#">Inicio</a></li>
					<li><a href="#">Suporte</a></li>
					<li><a href="#">Minha Conta</a></li>
					<li><a href="#">A Loja</a></li>
					<li class="last"><a href="#">Contato</a></li>
				</ul>
			</div>
		</div>
		<!-- End Header -->
		
		<!-- Slider -->
		<div id="slider">
			<div id="slider-holder">
				<ul>
				    <li><a href="#"><img src="css/images/slide1.jpg" alt="" /></a></li>
				    <li><a href="#"><img src="css/images/slide2.jpg" alt="" /></a></li>
				    <li><a href="#"><img src="css/images/slide1.jpg" alt="" /></a></li>
				    <li><a href="#"><img src="css/images/slide2.jpg" alt="" /></a></li>
				    <li><a href="#"><img src="css/images/slide1.jpg" alt="" /></a></li>
				    <li><a href="#"><img src="css/images/slide2.jpg" alt="" /></a></li>
				</ul>
			</div>
			<div id="slider-nav">
				<a href="#" class="prev">Voltar</a>
				<a href="#" class="next">Próxima</a>
			</div>
		</div>
		<!-- End Slider -->
		
	</div>
</div>
<!-- Top -->

<!-- Main -->
<div id="main">
	<div class="shell">
		
		<!-- Search, etc -->
		<div class="options">
			<div class="search">
				<form action="" method="post">
					<span class="field"><input type="text" class="blink" value="PESQUISAR" title="PESQUISAR" /></span>
					<input type="text" class="search-submit" value="GO" />
				</form>
			</div>
			<span class="left"><a href="#">Busca Avançada</a></span>
			
			<div class="right">
				<span class="cart">
					<a href="#" class="cart-ico">&nbsp;</a>
					<strong>$0.00</strong>
				</span>
				<span class="left more-links">
					<a href="#">Checar</a>
					<a href="#">Detalhes</a>
				</span>
			</div>
		</div>
		<!-- End Search, etc -->
		
		<!-- Content -->
		<div id="content">
			
			<!-- Tabs -->
			<div class="tabs">
				<ul>
				    <li><a href="#" class="active"><span>Passeio</span></a></li>
				    <li><a href="#"><span>Sports</span></a></li>
				    <li><a href="#" class="red"><span>Femininos</span></a></li>
				</ul>
			</div>
			<!-- Tabs -->
			
			<!-- Container -->
			<div id="container">
				
				<div class="tabbed">
					
					<!-- First Tab Content -->
					<div class="tab-content" style="display:block;">
						<div class="items">
							<div class="cl">&nbsp;</div>
							<ul>
							    <li>
							    	<div class="image">
							    		<a href="1.html"><img src="img/ecko.jpg" alt="" /></a>
							    	</div>
							    	<p>
							    		Tamanho: <span>P</span><br />
							    		Número de itens: <span>10</span><br />
							    		Marcas: <a href="#">Ecko</a>
							    	</p>
							    	<p class="price">Preço: <strong>R$ 415,00</strong></p>
							    </li>
							<ul>
							    <li>
							    	<div class="image">
							    		<a href="2.html"><img src="img/gap.jpg" alt="" /></a>
							    	</div>
							    	<p>
							    		Tamanho: <span>M</span><br />
							    		Número de itens: <span>5</span><br />
							    		Marcas: <a href="#">GAP</a>
							    	</p>
							    	<p class="price">Preço: <strong>R$ 512,00</strong></p>
							    </li>
							</ul>							    
							</ul>
							<div class="cl">&nbsp;</div>

						</div>
					</div>
					<!-- End First Tab Content -->
					
					<!-- Second Tab Content -->
					<div class="tab-content">
						<div class="items">
							<div class="cl">&nbsp;</div>
							<ul>
							    <li>
							    	<div class="image">
							    		<a href="3.html"><img src="img/vans.jpg" alt="" /></a>
							    	</div>
							    	<p>
							    		Tamanho: <span>M</span><br />
							    		Número de itens: <span>10</span><br />
							    		Marcas: <a href="#">Vans</a>
							    	</p>
							    	<p class="price">Preço: <strong>R$ 525,00</strong></p>
							    </li>
							    
							</ul>
							<div class="cl">&nbsp;</div>
						</div>
					</div>
					<!-- End Second Tab Content -->
					
					<!-- Third Tab Content -->
					<div class="tab-content">
						<div class="items">
							<div class="cl">&nbsp;</div>
							<ul>
							    <li>
							    	<div class="image">
							    		<a href="4.html"><img src="img/diesel.jpg" alt="" /></a>
							    	</div>
							    	<p>
							    		Tamanho: <span>P</span><br />
							    		Número de itens: <span>5</span><br />
							    		Marcas: <a href="#">Diesel</a>
							    	</p>
							    	<p class="price">Preço: <strong>R$ 474,00</strong></p>
							    </li>
							    
						    </ul>
							<div class="cl">&nbsp;</div>
						</div>
					</div>
					<!-- End Third Tab Content -->
					
				</div>
				
				<!-- Marcas -->
				<div class="brands">
					<h3>Marcas</h3>
					<div class="logos">
						<a href="#"><img src="css/images/logo1.jpg" alt="" /></a>
						<a href="#"><img src="css/images/logo2.jpg" alt="" /></a>
						<a href="#"><img src="css/images/logo3.jpg" alt="" /></a>
						<a href="#"><img src="css/images/logo4.jpg" alt="" /></a>
						<a href="#"><img src="css/images/logo5.jpg" alt="" /></a>
						
					</div>
				</div>
				<!-- Fim das Marcas -->
				
				<!-- Footer -->
				<div id="footer">
					<div class="left">
						<a href="#">Inicio</a>
						<span>|</span>
						<a href="#">Suporte</a>
						<span>|</span>
						<a href="#">Minha Conta</a>
						<span>|</span>
						<a href="#">A Loja</a>
						<span>|</span>
						<a href="#">Contato</a>
					</div>
					<div class="right">
						&copy; O Pacotao
					</div>
				</div>
				<!-- End Footer -->
				
			</div>
			<!-- End Container -->
			
		</div>
		<!-- End Content -->
		
	</div>
</div>
<!-- End Main -->
	
</body>
</html>